import { OneModal } from '@/components/one-ui';
import { IOneModalRef } from '@/pages/type';
import { fieldFlowExport, onCloseModalCommon } from '@/utils';
import { Ref, useRef } from 'react';
import { ExpertsUpdateService } from '../services/UpdateService';
import moment from 'moment';

const ExportModal = ({ onClose, searchParams, selectedRowKeys }) => {
  /**
   * 弹框的ref
   * */
  const modalRef: Ref<IOneModalRef> = useRef(null);

  /**
   * 导出专家接口
   * */
  const { exportExpertRun, exportExpertLoading } = ExpertsUpdateService()?.exportExpertService();

  /**
   * 弹窗关闭方法
   * */
  const onCloseModal = () => {
    onClose();
  };

  /**
   * 弹窗确认方法
   * */
  const onOkModal = async () => {
    let reqParams: Record<string, any> = { ...searchParams };
    if (selectedRowKeys?.length) {
      reqParams.ids = selectedRowKeys?.join(',');
    }
    const fileObj = await exportExpertRun({ ...reqParams });
    fieldFlowExport(fileObj, `专家库信息${moment()?.format('YYYYMMDDHHmmss')}.xlsx`);
    onCloseModalCommon(modalRef);
  };

  return (
    <OneModal
      open={true}
      getContainer={false}
      ref={modalRef}
      title={'导出专家'}
      onCancel={onCloseModal}
      onOk={onOkModal}
      width={document.body.clientWidth * 0.23}
      bodyStyle={{ padding: '20px 40px' }}
      confirmLoading={exportExpertLoading}
    >
      <div style={{ textAlign: 'center' }}>
        <p>
          请确认是否导出当前
          <span style={{ color: 'red' }}>{selectedRowKeys?.length ? '选中' : '筛选'}</span>
          的专家信息！
        </p>
      </div>
    </OneModal>
  );
};

export { ExportModal };
